<template>
  <div>
    <div class="titletopXX">
      <van-nav-bar
        size="30"
        :title="title"
        left-arrow
        right-text=""
        :fixed="true"
        @click-left="onClickLeft"
      >
        <!-- <template #left>
          <van-icon name="wap-home" size="28" />
        </template> -->
      </van-nav-bar>
    </div>
    <div class="pull-refresh">
      <div class="img-container">
        <van-image
          class="imgXX"
          width="100%"
          height="200"
          :src="require('../../static/CPYY.png')"
        />
      </div>
      <div class="tabs">
        <div
          @click="tab(0)"
          class="tabs1 tbXX"
          :style="
            tabid == '0' ? 'background: #fff;' : 'background: transparent;'
          "
        >
          每周<span :style="tabid == '0' ? 'color:#00BAAD' : 'color: #000;'"
            >菜谱</span
          >
        </div>
        <div
          @click="tab(1)"
          class="tabs1 tbXX"
          :style="
            tabid == '1' ? 'background: #fff;' : 'background: transparent;'
          "
        >
          每周<span :style="tabid == '1' ? 'color:#00BAAD' : 'color: #000;'"
            >接龙</span
          >
        </div>
        <div
          @click="tab(2)"
          class="tabs1 tbXX"
          :style="
            tabid == '2' ? 'background: #fff;' : 'background: transparent;'
          "
        >
          水果<span :style="tabid == '2' ? 'color:#00BAAD' : 'color: #000;'"
            >果切</span
          >
        </div>
      </div>
      <div class="MZCP" v-if="tabid == '0' && list.length > 0">
        <tabul :tabs="5" :list="listdateXX" :tabID="0" @tabFH="XXtab"></tabul>
        <div class="title_CPMC WZ_size_18">
          <div class="marginBottom10">
            {{ list[0].breakfast.goodName }}
          </div>

          <div class="MZCPul" v-if="list[0].breakfast.mealDishList.length > 0">
            <div
              v-for="(item, index) in list[0].breakfast.mealDishList"
              :key="index"
              class="MZCPli"
              @click="CPXQ(item)"
            >
              <van-image
                radius="10px"
                width="100%"
                height="120px"
                :src="item.image"
              />
              <div class="WZ_size_14 textCC1">{{ item.name }}</div>
              <div
                class="WZ_size_10 marginSX5 textCC1"
                style="color: rgb(128, 128, 128)"
              >
                {{ item.description }}
              </div>
              <div class="WZ_size_16" style="color: rgb(255, 141, 26)">
                ¥ {{ item.price }}
              </div>
            </div>
          </div>
          <div v-else class="WZ_size_16 ZWXX">暂无菜品</div>
        </div>
        <div class="title_CPMC WZ_size_18">
          <div class="marginBottom10">
            {{ list[0].lunch.goodName }}
          </div>
          <div class="MZCPul" v-if="list[0].lunch.mealDishList.length > 0">
            <div
              v-for="(item, index) in list[0].lunch.mealDishList"
              :key="index"
              class="MZCPli"
              @click="CPXQ(item)"
            >
              <van-image
                radius="10px"
                width="100%"
                height="120px"
                :src="item.image"
              />
              <div class="WZ_size_14 textCC1">{{ item.name }}</div>
              <div
                class="WZ_size_10 marginSX5 textCC1"
                style="color: rgb(128, 128, 128)"
              >
                {{ item.description }}
              </div>
              <div class="WZ_size_16" style="color: rgb(255, 141, 26)">
                ¥ {{ item.price }}
              </div>
            </div>
          </div>
          <div v-else class="WZ_size_16 ZWXX">暂无菜品</div>
        </div>
      </div>
      <div class="MZYY" v-if="tabid == '1'">
        <div class="titleXX">
          <div class="title WZ_size_24">
            {{ XXobj.name }}
          </div>
          <div class="marginTop10"></div>
          <div class="WZ_size_12 color1">截至时间： {{ XXobj.endTime }}</div>
          <div class="marginSX5"></div>
          <div class="WZ_size_12 color1">{{ RYnum }}人已参与接龙</div>
          <div class="marginTop10"></div>
          <div class="lan"></div>
          <div class="TJbox">
            <div class="TJli" v-for="(item, index) in TJlist" :key="index">
              <div class="TJtop">{{ item.categoryName }}:</div>
              <div v-if="item.mealDishList.length > 0">
                <div v-for="(item2, index2) in item.mealDishList" :key="index2">
                  {{ item2.name }}
                </div>
              </div>
              <div class="" v-else>暂无推荐菜</div>
            </div>
          </div>
          <div class="rich-text" v-dompurify-html="XXobj.text"></div>
        </div>
        <div class="CPlist">
          <div class="title">
            <div class="hen"></div>
            <div class="WZ_size_16 marginLeft10">餐品列表</div>
          </div>
          <div v-if="XXobj.mealDishList.length > 0">
            <div
              class="CPli"
              v-for="(item, index) in XXobj.mealDishList"
              :key="index"
            >
              <div class="flex">
                <div>
                  <van-image
                    radius="10"
                    width="80"
                    height="80"
                    :src="item.image"
                    mode=""
                  >
                  </van-image>
                </div>
                <div class="marginLeft10">
                  <div class="li_title">{{ item.name }}</div>
                  <div class="li_yl" v-if="item.allNum == 0">余量：不限量</div>
                  <div class="li_yl" v-else>余量：{{ item.surplusNum }}</div>
                </div>
              </div>
              <div class="li_felx">
                <div class="left">¥{{ item.price }}</div>
                <div class="right">
                  <van-stepper
                    active-color="#07c160"
                    inactive-color="#dcdee0"
                    class="stepper"
                    v-model="item.goodQty"
                    theme="round"
                    min="0"
                    :max="
                      formattedSurplusNum(
                        item.surplusNum,
                        item.allNum,
                        item.goodQty
                      )
                    "
                    :default-value="0"
                    @plus="valChange(item)"
                    @minus="J(item)"
                  />
                </div>
              </div>
              <van-divider />
            </div>
          </div>

          <div v-else class="WZ_size_16 ZWXX">暂无餐品</div>
        </div>
        <div class="CPlist">
          <div class="titleBox">
            <div class="title">
              <div class="hen"></div>
              <div class="WZ_size_16 marginLeft10">最新预约人员</div>
            </div>
            <div
              class="title_right WZ_size_16 GD"
              @click="TZ"
              v-if="objRY.companyId"
            >
              查看更多<van-icon name="arrow" />
            </div>
          </div>
          <div v-if="ListRY.length > 0">
            <div class="RYli" v-for="(item, index) in ListRY" :key="index">
              <div class="li_tile">
                <div class="name WZ_size_16">{{ item.userName }}</div>
                <div class="date WZ_size_16">{{ item.orderTime }}</div>
              </div>
              <div v-if="item.detailList.length > 0">
                <div
                  v-for="(item2, index2) in item.detailList"
                  :key="index2"
                  class="paddingLeft10 WZ_size_16 YYCPlist"
                >
                  {{ item2.name }}
                  <span style="color: rgb(255, 141, 26)">+{{ item2.qty }}</span>
                </div>
              </div>
              <van-divider />
            </div>
          </div>
          <div v-else class="WZ_size_16 ZWXX">暂无人员预订</div>
        </div>
        <div class="DI">
          <div style="font-size: 16px; margin-top: 10px; padding-top: 20px">
            合计费用：{{ ZJG }} <text v-if="ZJG > 0">元</text>
          </div>
          <van-button
            v-if="isButtonDisabled"
            style="width: 300px; margin-bottom: 20px"
            class="buy"
            color="#36C2A8"
            @click="jumpToBuy()"
            >预 订</van-button
          >
          <van-button
            v-else
            style="width: 300px; margin-bottom: 20px"
            class="buy"
            disabled
            >本周预订时间已过</van-button
          >
        </div>
      </div>
      <div
        v-if="tabid == '2'"
        style="background: #ffffff; z-index: 2; position: relative"
      >
        <van-tree-select
          class="XXselect"
          v-model:main-active-index="activeIndex"
          :items="items"
          :active-id="activeId"
          @click-nav="onClickNav"
        >
          <template #content>
            <van-pull-refresh
              height="calc(var(--real-vh, 1vh) * 100 - 100px - env(safe-area-inset-bottom) - env(safe-area-inset-top))"
              v-model="refreshing"
              @refresh="onRefresh"
            >
              <van-empty
                v-if="GQlist.length == 0 && !error"
                image="search"
                description="未找到数据"
              />
              <van-empty v-if="error" image="error" description="网络错误" />
              <van-list
                :immediate-check="false"
                v-model:loading="loading"
                :finished="finished"
                :error.sync="error"
                error-text="请求失败，点击重新加载"
                finished-text="没有更多了"
                @load="GetGQ"
              >
                <div class="ullist" v-if="GQlist.length > 0">
                  <div class="ul" v-for="(item, index) in GQlist" :key="index">
                    <div class="li">
                      <div>
                        <van-image
                          class="img"
                          radius="4"
                          width="70"
                          height="70"
                          :src="item.image"
                          mode=""
                        >
                        </van-image>
                      </div>
                      <div class="li_text">
                        <div class="title WZ_size_14" style="font-weight: 700">
                          {{ item.name }}
                        </div>
                        <div
                          class="text_JJ WZ_size_10 example1"
                          v-if="item.allNum == 0"
                        >
                          余量：不限量
                        </div>
                        <div class="text_JJ WZ_size_10 example1" v-else>
                          余量：{{ item.surplusNum }}
                        </div>
                        <div class="li_D">
                          <div class="Price WZ_size_10" style="color: #027571">
                            ￥{{ item.price }}
                          </div>
                          <van-stepper
                            class="stepper"
                            v-model="item.goodQty"
                            theme="round"
                            min="0"
                            :max="
                              formattedSurplusNum(
                                item.surplusNum,
                                item.allNum,
                                item.goodQty
                              )
                            "
                            :default-value="0"
                            @plus="GQvalChange(item)"
                            @minus="GQJ(item)"
                            input-width="24px"
                            button-size="18px"
                          />
                        </div>
                      </div>
                    </div>
                    <van-divider
                      :style="{
                        borderColor: '#999',
                        margin: '5px 0',
                      }"
                    >
                    </van-divider>
                  </div>
                </div>
                <template #error>
                  <div class="error-tip" @click="retryLoad">
                    <van-icon name="warning" />
                    <span>加载失败，点击重试</span>
                  </div>
                </template>
              </van-list>
            </van-pull-refresh>
          </template>
        </van-tree-select>
        <div class="DI">
          <div style="font-size: 16px; margin-top: 10px">
            合计费用：{{ GQZJG }} <text v-if="GQZJG > 0">元</text>
          </div>
          <van-button
            style="width: 300px; margin-bottom: 20px"
            class="buy"
            color="#36C2A8"
            @click="GQjumpToBuy()"
            >预 订</van-button
          >
        </div>
      </div>
    </div>
    <van-dialog v-model:show="show" title="菜品详情">
      <div class="CPXQCalss">
        <div class="CPXQli">
          <van-image
            radius="10px"
            width="120px"
            height="120px"
            :src="itemCP.image"
          />
          <div class="WZ_size_18">{{ itemCP.name }}</div>
          <div class="WZ_size_16 paddingSX10" style="color: rgb(128, 128, 128)">
            {{ itemCP.description }}
          </div>
          <div class="WZ_size_20" style="color: rgb(255, 141, 26)">
            ¥ {{ itemCP.price }}
          </div>
        </div>
      </div>
    </van-dialog>
    <van-calendar
      v-model:show="dateshow"
      @close="dateshow = false"
      :close-on-click-overlay="true"
      @confirm="calendar"
      color="#1989fa"
      :min-date="minDate"
    />
    <van-dialog v-model:show="TSshow" title="预定须知" @confirm="TZXX">
      <div class="rich-text" v-dompurify-html="TZGQ"></div>
    </van-dialog>
  </div>
</template>

<script>
import { getAccessToken } from "../../common/YYSLxx.js";
import { getmoreRoute } from "../../common/moreRouteList";
import { getandroidCode } from "../../common/auth";
import { selectUser } from "@/api/realAssets/icsharedstation/home";
import headerXX from "../../components/title.vue";
import {
  getMealList,
  getMealUserList,
  getWeekMealList,
  queryFruitCategory,
  getFruitList,
  queryFruitText,
} from "@/api/realAssets/icsharedstation/CPXX/index.js";
import moment from "moment";
import { Dialog, Toast } from "vant";
import tabul from "../../components/tab.vue";
import { testUserMessage } from "../../common/testUser.js";
export default {
  components: { headerXX, tabul },
  data() {
    return {
      activeId: 0,
      minDate: new Date(
        moment().add(1, "days").year(),
        moment().add(1, "days").month(),
        moment().add(1, "days").date()
      ),
      dateshow: false,
      GQlist: [],
      itemCP: {},
      show: false,
      items: [],
      activeIndex: 0,
      categoryList: [],
      isButtonDisabled: true,
      TJlist: [],
      objRY: {},
      ZJG: 0,
      id: "",
      RYnum: 0,
      ListRY: [],
      listdateXX: [
        { goodId: 0, goodName: "星期一" },
        { goodId: 1, goodName: "星期二" },
        { goodId: 2, goodName: "星期三" },
        { goodId: 3, goodName: "星期四" },
        { goodId: 4, goodName: "星期五" },
      ],
      title: "阳光食堂",
      tabid: 0,
      SGxx: [],
      GQZJG: 0,
      XXyz: {
        siteId: "",
        categoryId: 0,
        pageNumber: 1,
        pageSize: 10,
      },
      finished: false,
      error: false,
      loading: false,
      refreshing: false,
      PDtab: 0,
      siteData: JSON.parse(localStorage.getItem("siteData")),
      list: [],
      XXobj: {},
      TSshow: false,
      TZGQ: "",
    };
  },
  created() {},
  mounted() {
    testUserMessage("阳光食堂").then((siteData) => {
      this.siteData = siteData[0];
      this.XXyz.siteId = siteData[0].id;
      this.GetCP();
    });
  },
  methods: {
    TZXX() {
      this.TSshow = false;
      this.dateshow = true;
    },
    GQjumpToBuy() {
      if (this.SGxx == 0) {
        Dialog.alert({
          message: "请至少选择一项果切，才能预约！",
        });
        return;
      }
      this.TSshow = true;
      queryFruitText({ siteId: this.siteData.id }).then((res) => {
        if (res.resultCode == "1" && res.resultMessage == "SUCCESS") {
          this.TZGQ = res.data.textFruit;
        } else {
          Toast.fail("网络错误");
        }
      });
      // dateshow.value = true;
    },
    GQvalChange(val) {
      setTimeout(() => {
        if (val.onceNum > val.goodQty) {
          val.goodQty = val.onceNum;
        }
        this.GQZJG = 0;
        this.GQlist.forEach((item) => {
          let price = item.price * 1;
          // GQZJG.value += item.goodQty * price;
        });
        const isMatch = this.SGxx.some((item) => item.id === val.id);

        if (isMatch) {
          this.SGxx.forEach((item) => {
            if (item.id == val.id) {
              // 直接复制属性，而不是改变引用
              Object.assign(item, val);
              // console.log(item.id , val.id);
              // item = val;
            }
          });
        } else {
          this.SGxx.push(val);
        }
        if (this.SGxx.length > 0) {
          this.SGxx.forEach((item) => {
            // if(item.id==val.id){
            //    item=val
            // }
            let price = item.price * 1;
            this.GQZJG += item.goodQty * price;
          });
        }
      }, 0);
    },
    GQJ(val) {
      setTimeout(() => {
        if (val.goodQty < val.onceNum) {
          val.goodQty = 0;
        }
        this.GQZJG = 0;
        this.GQlist.forEach((item) => {
          let price = item.price * 1;
        });
        if (this.SGxx.length > 0) {
          this.SGxx.forEach((item) => {
            if (item.id == val.id) {
              Object.assign(item, val);
            }

            let price = item.price * 1;
            this.GQZJG += item.goodQty * price;
          });
          this.SGxx = this.SGxx.filter((item) => item.goodQty > 0);
        }
      }, 0);
    },
    calendar(e) {
      e = moment(e).format("YYYY-MM-DD");
      let SPlist = [];
      let itemList = [];
      this.SGxx.forEach((item) => {
        SPlist.push({
          id: item.id,
          requestQty: item.goodQty,
        });
        let obj = {
          goodId: item.id,
          goodName: item.name,
          servicePrice: item.price,
          serviceQty: item.goodQty,
          goodCountPrice: item.price * item.goodQty,
          serviceProjectName: "",
          remark: "",
          serviceMessage: "",
        };
        itemList.push(obj);
      });
      const currentTimeStamp = moment().unix();
      const min = BigInt("1" + "0".repeat(18));
      const max = BigInt("1" + "0".repeat(19));
      const randomNum =
        min + BigInt(Math.floor(Math.random() * Number(max - min)));
      let itemXX = {
        SBBT: this.title,
        companyId: -1,
        orderId: "",
        orderNumber: currentTimeStamp + randomNum.toString(), //预约编号
        siteId: this.siteData.id, //服务点id
        orderProject: this.title, //预约项目
        orderProjectType: "1", //0:   1:  (区分健康自测类型与其他类型)
        orderCreationTime: moment().format("YYYY-MM-DD"), //下单时间
        goodInfo: SPlist,
        estimateArrivalTime: e, //服务时间
        estimateArrivalTimeTitle: "取餐日期",
        estimateSumPrice: 0, //预估费用
        orderSubType: "", //预约类型
        serviceDescription: "", //服务介绍
        orderLocation: "", //预约地址(非空展示)
        serviceTip: "", //温馨提示(非空展示)
        goodSumPrice: "", //总价
        serviceTitleList: ["果切名称", "单价", "数量", "小计"], //服务标题
        goodList: [...itemList],
      };
      getAccessToken(itemXX, "果切预约");
    },
    GetGQ() {
      this.loading = true;
      if (this.error) return; // 如果当前是错误状态，不自动触发加载
      if (this.refreshing) {
        this.GQlist = [];
      }
      this.XXyz.categoryId = this.id;

      getFruitList(this.XXyz).then((res) => {
        if (res.resultMessage != "SUCCESS") {
          this.GQlist = [];
          this.error = true; // 显示错误提示
          // loading.value = false;
        } else if (res.data.length == 0) {
          this.GQlist = [];
          this.finished = true;
        } else {
          res.data.forEach((item) => {
            item.goodQty = 0;
          });
          if (this.SGxx.length > 0) {
            this.SGxx.forEach((item) => {
              res.data.forEach((item2) => {
                if (item.id == item2.id) {
                  item2.goodQty = item.goodQty;
                }
              });
            });
          }
          this.GQlist = [...this.GQlist, ...res.data];
          // list.value = res.data;
        }

        this.loading = false;
        // 判断是否已加载完所有数据
        if (this.GQlist.length == res.pageNum) {
          this.finished = true;
        } else {
          this.XXyz.pageNumber++;
        }
        this.refreshing = false;
      });
      // getFruitList().then(res=>{

      // })
    },
    CPXQ(val) {
      this.show = true;
      this.itemCP = val;
    },
    // 切换左侧分类

    onClickNav(index) {
      this.activeIndex = index;
      this.id = this.items[index].id;
      this.onRefresh();
    },
    // 下拉刷新
    onRefresh() {
      //   list.value = [];
      this.XXyz.pageNumber = 1;
      this.XXyz.pageSize = 10;
      this.finished = false;
      this.error = false;
      this.loading = true;
      this.refreshing = true;
      this.GetGQ();
    },
    // 点击重试
    retryLoad() {
      this.XXyz.pageNumber = 1;
      this.XXyz.pageSize = 10;
      this.finished = false;
      this.error = false;
      this.loading = true;
      this.refreshing = true;
      this.GetGQ();
    },
    //餐品数量
    valChange(val) {
      setTimeout(() => {
        if (val.onceNum > val.goodQty) {
          val.goodQty = val.onceNum;
        }
        this.ZJG = 0;
        this.XXobj.mealDishList.forEach((item) => {
          let price = item.price * 1;
          this.ZJG += item.goodQty * price;
        });
      }, 0);
    },
    J(val) {
      setTimeout(() => {
        if (val.goodQty < val.onceNum) {
          val.goodQty = 0;
        }
        this.ZJG = 0;
        this.XXobj.mealDishList.forEach((item) => {
          let price = item.price * 1;
          this.ZJG += item.goodQty * price;
        });
      }, 0);
    },
    //预定
    jumpToBuy() {
      if (this.ZJG == 0) {
        Dialog.alert({
          message: "请至少选择一项商品，才能参与接龙！",
        });
        return;
      }
      let SPlist = [];
      let itemList = [];
      this.XXobj.mealDishList.forEach((item) => {
        if (item.goodQty > 0) {
          SPlist.push({
            id: item.id,
            requestQty: item.goodQty,
          });
          let obj = {
            goodId: item.id,
            goodName: item.name,
            servicePrice: item.price,
            serviceQty: item.goodQty,
            goodCountPrice: item.price * item.goodQty,
            serviceProjectName: "",
            remark: "",
            serviceMessage: "",
          };
          itemList.push(obj);
        }
      });
      const currentTimeStamp = moment().unix();
      const min = BigInt("1" + "0".repeat(18));
      const max = BigInt("1" + "0".repeat(19));
      const randomNum =
        min + BigInt(Math.floor(Math.random() * Number(max - min)));
      let itemXX = {
        SBBT: this.title,
        companyId: this.XXobj.id,
        orderId: this.id,
        orderNumber: currentTimeStamp + randomNum.toString(), //预约编号
        siteId: this.siteData.id, //服务点id
        orderProject: this.title, //预约项目
        orderProjectType: "1", //0:   1:  (区分健康自测类型与其他类型)
        orderCreationTime: moment().format("YYYY-MM-DD"), //下单时间
        goodInfo: SPlist,
        estimateArrivalTime: this.XXobj.numTime, //服务时间
        estimateArrivalTimeTitle: "取餐日期",
        estimateSumPrice: 0, //预估费用
        orderSubType: "", //预约类型
        serviceDescription: "", //服务介绍
        orderLocation: "", //预约地址(非空展示)
        serviceTip: "", //温馨提示(非空展示)
        goodSumPrice: "", //总价
        serviceTitleList: ["餐品名称", "单价", "数量", "小计"], //服务标题
        goodList: [...itemList],
      };
      getAccessToken(itemXX, "餐品预约");
    },
    //跳转到更多人员列表
    TZ() {
      let li = encodeURIComponent(JSON.stringify(this.objRY));
      this.$router.push({
        name: "rvicsharedstation-CPYY_RYXX",
        query: {
          XX: li, // 序列化对象
        },
      });
      // router.push({
      //   name: "i_life_cpyy_RYXX",
      //   query: {
      //     XX: li, // 序列化对象
      //   },
      // });
    },
    formattedSurplusNum(val, val2, val3) {
      console.log(val, val2, val3);
      if (val2 > 1) {
        if (val > 0) {
          return val2;
        }
        if (val3 > 0 && val == 0) {
          return val3;
        }
        return val;
      }
      if (val2 == 0) {
        return 99999999999;
      }
    },
    checkTimeRestriction() {
      console.log(this.XXobj.endTime);
      this.isButtonDisabled = moment().isBefore(this.XXobj.endTime);
      console.log(this.isButtonDisabled);
    },
    getSP() {
      Toast.loading({
        duration: 3000,
        forbidClick: true,
        message: "数据加载中...",
      });
      selectUser({
        ishid: getandroidCode(), //拿到编码
      }).then((resXX) => {
        //获取餐品
        getMealList({
          siteId: JSON.parse(localStorage.getItem("siteData")).id,
          name: resXX.data.mobile,
          type: "1",
        }).then((res) => {
          Toast.clear();
          this.XXobj = res.data[0];
          this.checkTimeRestriction();
          this.TJlist = this.XXobj.categoryList;
          this.XXobj.mealDishList.forEach((item) => {
            item.goodQty = 0;
          });
          if (this.XXobj.orderDtoList.length > 0) {
            this.id = this.XXobj.orderDtoList[0].id;

            this.XXobj.orderDtoList[0].detailList.forEach((item) => {
              //餐品回显

              this.XXobj.mealDishList.forEach((item2) => {
                if (item.id == item2.mealtodishId) {
                  item2.goodQty = item.qty;
                  let price = item2.price * 1;
                  this.ZJG += item2.goodQty * price;
                }
              });
            });
          } else {
            this.id = "";
          }
          console.log(this.TJlist);
          //获取预约餐品人员列表
          this.getRY();
        });
      });
    },
    getRY() {
      this.objRY = {
        companyId: this.XXobj.id,
        orderTime: this.XXobj.numTime, //驿站id,
        siteId: this.siteData.id,
        postId: JSON.parse(localStorage.getItem("siteData")).postId,
        pageNumber: 1,
        pageSize: 10,
      };
      getMealUserList(this.objRY).then((resYY) => {
        //取最新3条显示
        this.RYnum = resYY.pageNum;
        this.ListRY = resYY.data.slice(0, 3);
      });
    },
    XXtab(val) {
      // console.log(val.goodId);
      this.PDtab = val.goodId;
      this.getMZCP();
    },
    getMZCP() {
      Toast.loading({
        duration: 3000,
        forbidClick: true,
        message: "数据加载中...",
      });
      getWeekMealList({
        siteId: this.siteData.id, //拿到编码
        categoryId: this.PDtab + 1,
      }).then((resXX) => {
        Toast.clear();
        this.list = resXX.data;
        this.list.forEach((item, index) => {
          item.goodId = index;
        });
        console.log("XX", this.list);
      });
    },
    getinformation() {
      queryFruitCategory({
        siteId: this.siteData.id,
      }).then((res) => {
        if (res.resultCode == "1" && res.resultMessage == "SUCCESS") {
          this.items = res.data;
          this.categoryList = res.data.map((item) => {
            item.goodName = item.categoryName;
            item.type = item.categoryType;
            item.goodId = item.id;
            return item;
          });
          //默认拿到第一个id
          this.id = this.items[this.activeIndex].id;
          this.items.forEach((item) => {
            item.text = item.categoryName;
          });
          this.GetGQ();
        } else {
          Toast.fail("网络错误");
        }
      });
    },
    GetCP() {
      const weekday = moment().day();
      switch (weekday) {
        case 1: // 星期一
          this.PDtab = 0;
          break;
        case 2: // 星期二
          this.PDtab = 1;
          break;
        case 3: // 星期三
          this.PDtab = 2;
          break;
        case 4: // 星期四
          this.PDtab = 3;
          break;
        case 5: // 星期五
          this.PDtab = 4;
          break;
        case 6: // 星期六
          this.PDtab = 0;
          break;
        case 0: // 星期日
          this.PDtab = 0;
          break;
        default:
          this.PDtab = 0; // 错误情况
          return;
      }

      this.getMZCP();
      // console.log({
      //   siteId: siteData.value.id, //拿到编码
      //   categoryId: PDtab.value + 1,
      // });
    },
    tab(val) {
      this.tabid = val;
      if (val == 0) {
        //每周菜
        this.GetCP();
      }
      if (val == 1) {
        //预约菜
        this.getSP();
      }
      if (val == 2) {
        //果切
        this.SGxx = [];
        this.GQZJG = 0;
        this.XXyz.pageNumber = 1;
        this.XXyz.pageSize = 10;
        this.finished = false;
        this.error = false;
        this.loading = true;
        this.refreshing = true;
        this.getinformation();
      }
    },
    onClickLeft() {
      this.$router.go(-1);
    },
  },
};
</script>
<style>
.van-sidebar-item--select:before {
  background-color: rgb(2, 117, 113) !important;
}
.van-stepper__plus {
  background-color: #36c2a8 !important;
}
.van-stepper__minus {
  color: #36c2a8 !important ;
  border: 0.02667rem solid #36c2a8 !important;
}
</style>
<style lang="less" scoped>
@import "../../static/css/index.less";
@import "../../static/css/GYcSS.less";
@import "../../static/css/rich-text.css";
.XXselect {
  height: calc(
    var(--real-vh, 1vh) * 100 - 320px - env(safe-area-inset-bottom) -
      env(safe-area-inset-top)
  ) !important;
}
.pull-refresh {
  position: relative;
  width: 100%;
  background: #fbf8ff;
  //padding-top: 80px;
  box-sizing: border-box;
}
.CPXQCalss {
  position: relative;
  text-align: center;
  // margin: 20px 0;
  padding: 20px;
  box-sizing: border-box;
  word-wrap: break-word; /* 允许长单词或URL地址内部换行 */
  // .CPXQli {
  //   position: absolute;
  //   left: 50%;
  //   top: 50%;
  //   transform: translate(-50%, -50%);
  // }
}
.title_CPMC {
  margin-bottom: 10px;
  color: rgb(46, 52, 58);
}
.DI {
}
.MZCPul {
  display: flex;

  padding-right: 10px;
  overflow-y: hidden;
  overflow-x: scroll;
}
.MZCPli {
  width: 33%;
  flex-shrink: 0;
  border-radius: 5px;
  font-weight: 600;
  margin-left: 10px;
}
.MZYY {
  padding-bottom: 120px;
}
.tabul {
  background: #ffffff;
  padding: 10px 0 !important;
}
.MZCP {
  background: #ffffff;
  width: 100%;
  padding: 20px;
  padding-top: 0px;
  box-sizing: border-box;
  // border-radius: 40px;
  margin: 0 auto;
  z-index: 2; // 提高z-index确保在图片上方
  position: relative; // 添加相对定位
}
.tabs {
  background: url("./imgs/BJbox.png") no-repeat;
  background-size: 100% 100%;
  width: 100%;
  height: 60px;
  z-index: 999;
  position: relative; // 添加相对定位
  margin-top: -100px;
  border-radius: 20px 20px 0 0;
  display: flex;
  overflow: hidden;
  .tabs1 {
    width: 50%;
  }
  .tbXX {
    position: relative;
    font-size: 18px;
    text-align: center;
    line-height: 60px;
    font-weight: 700;
  }
  .tabs2 {
    width: 50%;
  }
}
.ZWXX {
  text-align: center;
  padding: 10px;
  font-weight: 700;
}
// .pull-refresh {
//   height: calc(
//     var(--real-vh, 1vh) * 100 - 100px - env(safe-area-inset-bottom) -
//       env(safe-area-inset-top)
//   );
// }
// 添加图片容器
.img-container {
  position: relative;
  height: 200px; // 与图片高度相同
  width: 100%;
  overflow: hidden;
}
.YYCPlist {
  line-height: 30px;
}
.titleBox {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
  .title {
    margin: 0 !important;
  }
  .GD {
    width: 120px;
    display: flex;
    align-items: center;
    color: rgb(128, 128, 128);
  }
}
.RYli {
  padding: 0 20px;
  box-sizing: border-box;
  .li_tile {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    .name {
      font-weight: 700;
    }
    .date {
      color: rgb(128, 128, 128);
      margin-left: 10px;
    }
  }
}
.CPli {
  padding: 0 20px;
  // padding-bottom: 0px;
  .flex {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }
  .li_title {
    font-size: 16px;
    font-weight: 700;
  }
  .li_yl {
    font-size: 12px;
    color: rgb(128, 128, 128);
    margin: 5px 0;
  }
  .li_felx {
    display: flex;
    justify-content: space-between;
    align-items: center;
    .left {
      font-size: 20px;
      color: rgb(255, 141, 26);
    }
  }
}
.TJbox {
  color: rgb(102, 102, 102);
  font-size: 14px;
  margin-top: 20px;
  .TJli {
    margin-bottom: 20px;
    line-height: 20px;
  }
  .TJtop {
  }
}
.imgXX {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  // 移除width:100%可能导致的溢出
  max-width: 100%;
}
.CPlist {
  margin-top: 20px;
  background: #fff;
  .title {
    display: flex;
    height: 40px;
    width: 100%;
    align-items: center;
    font-weight: 700;
    margin-bottom: 20px;
  }
}
.hen {
  height: 100%;
  width: 5px;
  background: rgba(54, 194, 168, 1);
}
.titleXX {
  width: 100%;
  padding: 20px;
  padding-top: 0px;
  box-sizing: border-box;
  // border-radius: 40px;
  margin: 0 auto;
  background: #ffffff;
  z-index: 2; // 提高z-index确保在图片上方
  position: relative; // 添加相对定位
  //  margin-top: -130px; // 向上移动30px覆盖部分图片
  .title {
    font-weight: 700;
  }
  .lan {
    width: 30px;
    height: 5px;
    border-radius: 3px;
    background: rgb(54, 194, 168);
  }
}
.color1 {
  color: rgb(51, 51, 51);
}
.buy {
  margin-top: 10px;
}
</style>
